<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<html>
	<head>
		<meta charset="utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
		<title>用户问答管理系统</title>
		<link href="/css/page.css" th:href="@{/css/page.css}" rel="stylesheet"/>
		<script th:src="@{/js/jquery.min.js}"></script>
		<style type="text/css">

		</style>
	</head>
	<body>
		<!--头-->
		<div class="top">
			<div class="container">
				<a href=""><img th:src="@{/img/jt_top.png}" alt="" style="margin-top: 37px;" class="fl"/></a>
				<h3 class="fl">用户问答管理系统</h3>
				<a href=""><img th:src="@{/img/col_top.png}" alt="" style="margin-top: 23px;" class="fr"/></a>
			</div>
		</div>
		<input type="file" accept="image/*" onchange="uploadFile()" id="fileUpload" multiple="multiple" hidden/>
		<!--用户信息-->
		<form>
		<div class="user container">
			<h2>用户信息</h2>
			<p>
				姓 名
				<input type="text" name="" id="" value="" />
			</p>
			<p>
				电 话
				<input type="text" name="" id="" value="" />
			</p>
			<p>
				软 件
				<a href=""><span>请选择<b>&nbsp;&nbsp;&nbsp;&nbsp;</b></span></a>
			</p>
			<p>
				版 本
				<a href=""><span>请选择<b>&nbsp;&nbsp;&nbsp;&nbsp;</b></span></a>
			</p>
		</div>
		<!--问题描述-->
		<div class="question">
			<div class="container">
				<h2>问题描述</h2>
				<input type="text" name="" id="" placeholder="您有什么需要解决的问题和疑问吗？请详细描述下吧……" class="fl" />
				<div class="images" id="image-div">
					<img th:src="@{/img/img_demo.jpg}" alt="" />
				</div>
				<a href="#" id="btnID"><div class="add"></div></a>
				<div class="clear"></div>
				<!--匿名-->
			</div>
		</div>
		</form>
		<!--问题评价-->
			<script>
			var preFile = "http://211.149.205.33:18080/file/";
			var arr =[];  //定义一个数组

			$(function(){
					$("ul li").click(function(){
						$(this).addClass("color").siblings().removeClass("color");
					});
					$("ol li").click(function(){
						$(this).addClass("bg").siblings();
					});
					
				})
				
				 // 隐式创建一个input控件，然后实现直接访问相册
            $("#btnID").click(function() {
                // 这里是模拟点击了input控件
                $("#fileUpload").click();
            });
			
        function uploadFile(){		 //
            var file = $("#fileUpload").get(0).files[0];
            if(file != undefined){
                var formData = new FormData();
                formData.append("files", file);
                $.ajax({
                    url:preFile+"mulitiupload",
                    type: "POST",
                    data: formData,
                    cache: false,
                    contentType: false,
                    processData: false,
                    success: function(resp) {
                        var model=new Object();
                        model.fileId =resp[0].fileid; //文件id
                        model.fileName =resp[0].name;//文件名称
                        var index = model.fileName.lastIndexOf(".");
                        var suffix = model.fileName.substring(index+1);
                        model.fileType =suffix; //文件类型
                        arr.push(model);
                        $("#image-div").append('<img src="'+preFile+'img/'+model.fileId+'" />');

                    },
                    error: function(error) {
                        $.modal.alertWarning("附件上传失败。");
                    }
                });
            } else {
                $.modal.alertWarning("服务出现错误 。联系管理员 ");
            }
        };

            var rootResize = function () {
                var baseFontSize = 100;
                var baseWidth = 640;
                var minWidth = 320;
                var clientWidth = document.documentElement.clientWidth || window.innerWidth;
                var innerWidth = Math.max(Math.min(clientWidth, baseWidth), minWidth);

                var rem = clientWidth / (baseWidth / baseFontSize);
                if (innerWidth == 640 || innerWidth == 320) {
                    rem = innerWidth / (baseWidth / baseFontSize)
                }

                document.querySelector('html').style.fontSize = rem + 'px';
            };
            rootResize();
            window.οnresize = function () {
                rootResize()
            };

			</script>
		<div class="container">
			<button type="button" >提 交</button>
		</div>
		
	</body>
</html>
